<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>  
</head>
<body>
  <!-- Vue的控制范围 -->
  <div id="app"> 
    <h2>校名：{{ school.name}}</h1>
    <h2>地址：{{school.address}}</h1>
    <h2>成立日期：{{school.birthday}}</h1>
    
    <div v-for="(n,i) in names">{{i}} - {{n}}</div>
    
  </div>

  <!-- 引入Vue框架 -->
  <script src="js/vue.js"></script>

  <!-- 用户编写Vue代码 -->
  <script>  

    //实例化Vue对象  
    let vm =  new Vue({      
      el: '#app', //挂载元素
      
      data:{        
        school:{ name:'武汉科技大学',  address:'湖北省武汉市江夏区黄家湖西路',  birthday: '1958年' },
        student:{ f_id:1, f_name:'张三丰', f_sex:'男', f_birthday:'2000-11-11', f_major_id:2 },
        names:['武汉工商学院','湖北中医药大学','武汉科技大学','武汉交通职业学院']
      }
      
    })
  </script>
</body>
</html>